const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const path = require('path');

module.exports = {
    entry: __dirname + "/app/main.js", //入口文件
    output: {
        path: __dirname + "/public", //打包后的文件存放的地方
        filename: "bundle.js" //打包后输出文件的文件名
    },
    devtool: 'eval-source-map', //代码映射
    // devtool: 'none',
    devServer: {
        contentBase: "./public", //本地服务器所加载的页面所在的目录
        historyApiFallback: true, //不跳转
        port: "5100",
        inline: true //实时刷新
    },
    resolve: {
        alias: {
            fuelux: path.join(__dirname, "/node_modules/fuelux/dist/js/fuelux.js")
        }
    },
    module: {
        rules: [{
                // 得到jquery模块的绝对路径
                test: require.resolve('jquery'),
                // 将jquery绑定为window.jQuery
                loader: 'expose-loader?jQuery!expose-loader?$'
            },
            // import Fuelux
            {
                test: /fuelux\/js\/.*\.js$/,
                use: ['imports-loader?define=>false']
            },
            {
                test: /(\.jsx|\.js)$/,
                use: {
                    loader: "babel-loader",
                    options: {
                        presets: [
                            "es2015", "react"
                        ]
                    }
                },
                exclude: /node_modules/
            },
            // bootstrap里面的字体需要loader
            {
                test: /\.woff2?$|\.ttf$|\.eot$|\.svg$/,
                use: [{
                    loader: "file-loader"
                }]
            },
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: [{
                        loader: "css-loader"
                            // 如果使用模板CSS，会导致全局css问题，例如bootstrap
                            // ,options: {
                            //     modules: true
                            // }
                    }, {
                        loader: "postcss-loader"
                    }],
                })
            }
        ]
    },
    plugins: [
        new webpack.BannerPlugin('版权所有，翻版必究'), //版权声明
        //new 一个这个插件的实例，并传入相关的参数
        new HtmlWebpackPlugin({
            template: __dirname + "/app/index.tmpl.html"
                // , inject: "head"  //修改插入地方   
        }),
        // 提取css样式
        new ExtractTextPlugin("[name].[hash].css"),
        new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery",
            "window.jQuery": "jquery"
        })
        // new webpack.HotModuleReplacementPlugin(), //热加载插件
        // new webpack.optimize.OccurrenceOrderPlugin(),
        // new webpack.optimize.UglifyJsPlugin(),
    ]
}